//endcourse 已上课程样式
import React from 'react';
import MyClassform from './myClassform'
import http from '../../utils/http';
import Pager from '../components/Pager'
class MyClass extends React.Component{
  state={
    pagers: {
      count: 5,
      index: 0,
      total: 0,
    },
    classList:[],
    haveclass:false
  }
  changePage = (page) => {
    const pagers = this.state.pagers
    pagers.index = page
    this.setState({
      pagers
    })
    this.getOrdercourse()
  }
  getOrdercourse(){
    const pagers = this.state.pagers
    http
      .get('course/find/attendClass', {
        
        params: {
          count: this.state.pagers.count,
          index: this.state.pagers.index,
        
          serviceId:Number(this.props.location.search.substring(4))
        }
      })
      .then(data=>{
        if(data.dataList.length===0||data===null){
          this.setState({
            haveclass:true
          })
        }else{
        data = data || {}
        pagers.total = data.count
        this.setState({
          pagers,
          classList:data.dataList || []
        })
        }
        
      },err=>{
    })
  }
  //订单接口调取数据执行
  componentDidMount(){    
    this.getOrdercourse();

  }
  render(){
      return (
        <div className="classed">

         <div>
             <p style={{ fontFamily: 'PingFangSC-Regular',fontSize:18,color:'rgb(64,75,191)',
                borderBottom:"1px solid #404BBF",textAlign:"left",paddingBottom: 5, marginRight: 15,
                marginLeft: 15,}}>全部课程</p>
         </div>
          {/* 没有课程的样式 */}
          {this.state.haveclass?<div style={{width:"100%",height:"100%",textAlign:"center",paddingTop:365,fontFamily: "PingFangSC-Regular",fontSize: 16,color: "#858585",letterSpacing: 0.21}}>您目前没有已上课程</div>:""}

          {/* 课程表单 */}
            {
              this.state.classList.map((item,index)=>{
                  return <MyClassform dataText={item} key={item.id}/>
              })
            }
            <Pager pagers={this.state.pagers} changePage={this.changePage}></Pager>
        </div>
      )
  }
}

export default MyClass